@import "base";

@baseSize: 37.5rem;

/**
  头部
 */
header {
  width: (375 / @baseSize);
  height: (40 / @baseSize);
  display: flex;
  padding: 0 (15 / @baseSize);
  justify-content: space-between;
  align-items: center;

  .icon-left {
    font-size: (22 /@baseSize);
  }

  h3 {
    font-size: (17 / @baseSize);
  }

  .note {
    font-size: (15 / @baseSize);
    color: #2CB5A5;
  }
}

/**
  内容区域
 */
.content {
  margin-top: (30 / @baseSize);

  img {
    display: flex;
    margin: 0 auto;
    width: (240/@baseSize);
    height: (206 / @baseSize);
  }

  p {
    font-family: PingFang SC, serif;
    margin-top: (18 / @baseSize);
    text-align: center;

    span {
      color: #16C2A3;
    }
  }
}

/**
  类型按钮区域
 */
.type {
  margin-top: (33 / @baseSize);
  padding: 0 (15 / @baseSize);

  ul li {
    border: (1 / @baseSize) solid #EDEDED;
    border-radius: (10 / @baseSize);
    padding: (15 / @baseSize);
    a {
      position: relative;
      width: 100%;
      height: 100%;

      display: flex;
      img {
        width: (40 /@baseSize);
        height: (40 /@baseSize);
        margin-right: (14 / @baseSize);
      }
      .p1 {
        font-size: (16 /@baseSize);
      }
      .p2 {
        margin-top: (4 /@baseSize);
        font-size: (13 /@baseSize);
      }
      .icon-right {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
      }
    }
  }
}







